<template>
  <div id="app" class="skLifeCard">
    <template v-if="stuSleepInfoShow">
      <a-card :bordered="true" v-if="tableVisible">
        <sk-life-sleep :cardTitle="'睡眠'"  :result="sleepData" @lifeData="getLifeData"></sk-life-sleep>
        <sk-life-water-toilet @lifeData="getLifeData"  :cardTitle="'喝水'" :result="drinkData" ></sk-life-water-toilet>
        <sk-life-water-toilet @lifeData="getLifeData"  :cardTitle="'如厕'" :result="toiletData" ></sk-life-water-toilet>
      </a-card>
      <sk-life-table v-else :detailName="detailName" @lifeData="getLifeData" :dateType="dateType" :classId="classId" ></sk-life-table>
    </template>
    <sk-life-stu-sleep-info v-else @lifeData="getLifeData"></sk-life-stu-sleep-info>
  </div>
</template>
<script>
import skLifeSleep from "./life/skLifeSleep.vue";
import skLifeWaterToilet from "./life/skLifeWaterToilet.vue";
import skLifeTable from "./life/skLifeTable.vue";
import { drinkAndToilet, querySleep } from '@/api/health.js'
import skLifeStuSleepInfo from "./life/skLifeStuSleepInfo.vue";
import { skClassList } from '@/api/management.js'
export default {
  name: 'skLifeCard',
  data() {
    return {
      drinkData:null,
      toiletData:null,
      sleepData:null,
      
      dataDate:"",
      url:{
        drink:"/health/drink/lifeRecordList",
        toilet:"/health/toilet/lifeRecordList",
        sleep:"/health/sleep/lifeRecordList",
      },
      tableVisible:true,
      stuSleepInfoShow:true,
      detailName:"喝水",
      dateType:"week",
      classId:"0",
    }
  },
  components: {
    skLifeSleep,
    skLifeWaterToilet,
    skLifeTable,
    skLifeStuSleepInfo
  },

  filters: {},

  computed: {
    // classList:{
    //   get(){
    //     this.$store.state.skCommon.classList;
    //   },
    //   set(val){
    //     this.$store.dispatch("setClassList",val)
    //   }
    // }
  },

  created() {
    this.getDrinkAndToilet(this.url.drink,0);
    this.getDrinkAndToilet(this.url.toilet,1);
    this.getSleep(this.url.sleep);
    // this.getClassList();
  },

  activated() {},

  mounted() {
  },

  methods: {
    // 获取参数
    getLifeData(data){
      this.tableVisible = data.show;
      if (data.stuSleepInfoShow == false) {
        this.stuSleepInfoShow = false;
      }else{
        if (data.show ) {
          this.stuSleepInfoShow = true;
          this.classId = "0";
          this.getDrinkAndToilet(this.url.drink,0);
          this.getDrinkAndToilet(this.url.toilet,1);
          this.getSleep(this.url.sleep)
        }else{
          this.classId = data.classId;
          this.stuSleepInfoShow = true;
          this.detailName = data.detailName;
          this.dateType = data.dateType;
        }
      }
    },
    
    // 获取所有的班级
    getClassList() {
      this.classLoading = true;
      this.dataDate = this.$skCommon.getDate(1);
      skClassList()
        .then(res => {
          if (res.success) {
            this.classList = res.result;
            // this.classList.unshift({ className: '全园' })
          } else {
            this.$message.warning(res.message)
          }
        })
        .catch(error => {
          console.error(error)
        })
    },
    // 查询喝水\如厕记录
    getDrinkAndToilet(url,status) {
      let params = {
        queryDate:this.$skCommon.getDate(0)
      }
      drinkAndToilet(url,params)
        .then(res => {
          if (res.success) {
            if (status) {
              this.toiletData = res.result
            }else{
              this.drinkData = res.result
            }
          } else {
            this.$message.warning(error.message)
          }
        })
        .catch(error => {
          console.error(error)
        })
    },
    // 获取睡眠记录
    getSleep(url){
      let params = {
        queryDate:this.$skCommon.getDate(0)
      }
      querySleep(url,params).then((res)=>{
        if(res.success){
          this.sleepData = res.result;
        } else {
          this.$message.warning(res.message);
        }
      }).catch(()=>{
      })
    },
    
  }
}
</script>
<style scoped>
/* @import url(); 引入css类 */
</style>
